<template>
    <div class="box">
        <h1>Heater{{count2}} 电影的总长度{{movieList.length}}</h1>
        <button @click="addOne">累加</button>
        <button @click="addTwo({n:3})">累加</button>
        <h3>我的id为{{id3}}</h3>
    </div>
</template>

<script>
import { mapMutations, mapState } from 'vuex'
    export default {
        name : 'Heater',

        computed:{
            // ...mapState(["count" , "id"])
            ...mapState({count2:"count",id3 : "id",movieList : "movieList"}),
        },
        methods:{
            // ...mapMutations(["add","addN"])
            ...mapMutations({
                addOne : "add",
                addTwo : "addN"
            })
        }
    }
</script>

<style scoped>
    .box{
        text-align: center;
        height: 200px;
        margin: 30px;
        background: yellowgreen;
    }
</style>